<?php
/*------------------------------------------------------------------------

# TZ Portfolio Extension

# ------------------------------------------------------------------------

# author    TranLamTemPlaza

# copyright Copyright (C) 2012 templaza.com. All Rights Reserved.

# @license - http://www.gnu.org/licenses/gpl-2.0.html GNU/GPL

# Websites: http://www.templaza.com

# Technical Support:  Forum - http://templaza.com/Forum

-------------------------------------------------------------------------*/

defined('_JEXEC') or die;
$doc = JFactory::getDocument();
$doc->addStyleSheet('modules/mod_tz_teaser_slide/css/style.css');
$doc->addStyleSheet('modules/mod_tz_teaser_slide/showbizpro/css/settings.css');
$doc->addStyleSheet('modules/mod_tz_teaser_slide/showbizpro/fancybox/jquery.fancybox.css?v=2.1.3');
$doc->addScript('modules/mod_tz_teaser_slide/showbizpro/fancybox/jquery.fancybox.pack.js?v=2.1.3');
$doc->addScript('modules/mod_tz_teaser_slide/showbizpro/js/jquery.themepunch.showbizpro.min.js');

?>

<!-- THE CONTENT // DEMOS -->
<div class="demos">

<div class="divide30"></div>

<!-- DEMO V. -->
<div id="example5" class="showbiz-container fullwidth">

<!-- THE NAVIGATION  -- OUTSIDE THE SHOWBIZ CONTAINER FOR BG COLORISING-->
<div class="showbiz-navigation center sb-nav-dark">
    <a id="showbiz_left_5" class="sb-navigation-left"><i class="sb-icon-left-open"></i></a>
    <a id="showbiz_play_5" class="sb-navigation-play"><i class="sb-icon-play sb-playbutton"></i><i class="sb-icon-pause sb-pausebutton"></i></a>
    <a id="showbiz_right_5" class="sb-navigation-right"><i class="sb-icon-right-open"></i></a>
    <div class="sbclear"></div>
</div> <!-- END OF THE NAVIGATION -->

<div class="divide20"></div>

<!--	THE PORTFOLIO ENTRIES	-->
<div class="showbiz" data-left="#showbiz_left_5" data-right="#showbiz_right_5" data-play="#showbiz_play_5">
    <!-- THE OVERFLOW HOLDER CONTAINER, DONT REMOVE IT !! -->
    <div class="overflowholder">
        <!-- LIST OF THE ENTRIES -->
        <ul>
            <?php
            for($i=0;$i<count($rows);$i++){
                if($i%3==0){$color_bg = "redbg";}
                if($i%3==1){$color_bg = "bluebg";}
                if($i%3==2){$color_bg = "blackbg";}

                if($rows[$i] -> type == 'video'):
                ?>
                    <!-- AN ENTRY HERE WITH PREDEFINED MEDIA SKIN-->
                    <li class="sb-media-skin">

                        <!-- THE MEDIA HOLDER -->
                        <div class="mediaholder">
                            <div class="mediaholder_innerwrap">
                                <img alt="" src="<?php echo JUri::base().substr($rows[$i] ->videothumb,0,98)."_L.".substr($rows[$i] ->videothumb,99);?>">
                            </div>
                        </div><!-- END OF MEDIA HOLDER -->

                        <!-- ANIMATED HEADING INFORMATION, ALWAYS VISIBLE -->
                        <h4 class="showbiz-title go-to-top"><div class="<?php echo $color_bg;?>"><a href="<?php echo $rows[$i] ->link;?>"><?php echo $rows[$i] ->title;?></a></div></h4>


                        <!-- REVEAL CONTAINER (SINGLE MODE) -->
                        <div class="reveal_container">

                            <!-- THE REVEAL CONTENT, ONLY IN DETAIL MODE VISIBLE -->
                            <div class="reveal_wrapper">
                                <!-- THE YOUTUBE OR VIMEO HELPER CLASS (sb-yt-markup or sb-vimeo-markup) USE OPTIONS FOR IFRAME MARKUP BUILDING -->
                                <div class="sb-yt-markup" data-videoid="<?php echo substr($rows[$i]->video,8);?>"></div>
                            </div>

                        </div><!-- END OF REVEAL CONTAINER -->

                        <!-- THE REVEAL OPEN/CLOSE BUTTON - ONLY VISIBLE ON HOVER, DEFAULT STYLE -->
                        <a class="reveal_opener show_on_hover sb-centered sb-controll-button">
                            <span class="openme"><i class="sb-icon-play"></i></span>
                            <span class="closeme"><i class="sb-icon-cancel"></i></span>
                        </a>
                    </li><!-- END OF ENTRY -->
                <?php
                endif;
                if($rows[$i] -> type == 'image'):
                ?>
                    <!-- AN ENTRY HERE -->
                    <li class="sb-media-skin">
                        <div class="mediaholder ">
                            <div class="mediaholder_innerwrap">
                                <img alt="" src="<?php echo JUri::base().substr($rows[$i] ->images,0,69)."_L.".substr($rows[$i] ->images,70);?>">
                            </div>
                        </div>

                        <!-- ANIMATED HEADING INFORMATION, ALWAYS VISIBLE -->
                        <h4 class="showbiz-title go-to-top"><div class="<?php echo $color_bg;?>"><a href="<?php echo $rows[$i] ->link;?>"><?php echo $rows[$i] ->title;?></a></div></h4>


                        <div class="reveal_container">
                            <h4 class="showbiz-title go-to-top"><div class="bluebg"><a href="<?php echo $rows[$i] ->link;?>"><?php echo $rows[$i] ->title;?></a></div></h4>
                            <div class="reveal_wrapper">
                                <p class="p40"><?php echo $rows[$i] ->introtext;?></p>
                            </div>

                        </div>

                        <!-- THE REVEAL OPEN/CLOSE BUTTON - ONLY VISIBLE ON HOVER, DEFAULT STYLE -->
                        <a class="reveal_opener show_on_hover">
                            <span class="openme">+</span>
                            <span class="closeme">-</span>
                        </a>
                    </li>
                <?php
                endif;
            }
            ?>

        </ul>
        <div class="sbclear"></div>
    </div> <!-- END OF OVERFLOWHOLDER -->
    <div class="sbclear"></div>
</div>
</div><!-- END OF DEMO III. -->



<div class="divide30"></div>

</div> <!-- END OF DEMOS -->

<script type="text/javascript">

    jQuery(document).ready(function() {

        jQuery('#example5').showbizpro({
            dragAndScroll:"<?php if($drag_and_scroll==1){echo "on";} else echo "off";?>",
            visibleElementsArray:[3,2,1,1],
            carousel:"<?php if($carousel==1){echo "on";} else echo "off";?>",
            ytMarkup:"<iframe src='http://www.youtube.com/embed/%%videoid%%?hd=1&amp;wmode=opaque&amp;autohide=1&amp;showinfo=0&amp;autoplay=1' height='260px'></iframe>",
            vimeoMarkup:"<iframe src='http://player.vimeo.com/video/%%videoid%%?title=0&amp;byline=0&amp;portrait=0;api=1&amp;autoplay=1'></iframe>",
            closeOtherOverlays:"on",
            allEntryAtOnce:"<?php if($all_entry_at_once==1){echo "on";} else echo "off";?>",
            mediaMaxHeight:[450,300,340,260],
            rewindFromEnd:"<?php if($rewind_from_end==1){echo "on";} else echo "off";?>",
            autoPlay:"<?php if($auto_play==1){echo "on";} else echo "off";?>",
            delay:<?php echo $delay;?>,
            speed:<?php echo $speed;?>

        });

        // THE FANCYBOX PLUGIN INITALISATION
        jQuery(".fancybox").fancybox();

    });

</script>